<template>
    <Row :gutter="16" style="height: 100%;">
        <Col span="6" style="background-color: white;height: 100%;">
        <Tree :data="baseData" show-checkbox></Tree>
        </Col>
        <Col span="18">
        <Table border :columns="columns7" :data="data6"></Table>
        </Col>
    </Row>
</template>

<script>
  import util from "../../../libs/util.js"
  export default {
    data() {
      return {
        baseData: [
          {
            expand: true,
            title: "parent 1",
            children: [
              {
                title: "parent 1-0",
                expand: true,
                disabled: true,
                children: [
                  {
                    title: "leaf",
                    disableCheckbox: true
                  },
                  {
                    title: "leaf"
                  }
                ]
              },
              {
                title: "parent 1-1",
                expand: true,
                checked: true,
                children: [
                  {
                    title: '<span style="color: red">leaf</span>'
                  }
                ]
              }
            ]
          }
        ],
        columns7: [
          {
            title: "姓名",
            key: "name",
            render: (h, params) => {
              return h("div", [
                h("Icon", {
                  props: {
                    type: "person"
                  }
                }),
                h("strong", params.row.name)
              ]);
            }
          },
          {
            title: "年龄",
            key: "age"
          },
          {
            title: "地址",
            key: "address"
          },
          {
            title: "操作",
            key: "action",
            width: 150,
            align: "center",
            render: (h, params) => {
              return h("div", [
                h(
                  "Button",
                  {
                    props: {
                      type: "primary",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.show(params.index);
                      }
                    }
                  },
                  "查看"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "error",
                      size: "small"
                    },
                    on: {
                      click: () => {
                        this.remove(params.index);
                      }
                    }
                  },
                  "删除"
                )
              ]);
            }
          }
        ],
        data6: [
          {
            name: "王小明",
            age: 18,
            address: "北京市朝阳区芍药居"
          },
          {
            name: "张小刚",
            age: 25,
            address: "北京市海淀区西二旗"
          },
          {
            name: "李小红",
            age: 30,
            address: "上海市浦东新区世纪大道"
          },
          {
            name: "周小伟",
            age: 26,
            address: "深圳市南山区深南大道"
          }
        ]
      };
    },
    created: function () {
      //this.queryTree()
      this.queryResource(1)
    },
    methods: {
      queryTree(){
        let self = this
        util.ajax.get('resource')
          .then((response) => {
            let resposeData = response.data
            if (resposeData.flag === 1) {

            } else {

            }
          })
          .catch(function (response) {
            console.log(response)
          })
      },
      queryResource(parentId){
        if (parentId !== undefined && parentId !== null) {
          util.ajax.post('resource/all', {
            'parentId': 1
          })
            .then((response) => {
              let resposeData = response.data
              if (resposeData.flag === 1) {
                console.log(resposeData)
              } else {

              }
            })
            .catch(function (response) {
              console.log(response)
            })
        }
      },
    }
  };
</script>
